<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>登录页面</title>
		<!-- <link href='https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css' rel='stylesheet'> -->
		<link rel="stylesheet" href="../css/boxicons.min.css" />

		<link rel="stylesheet" href="../css/style.css">

		<script src="../js/vue.min.js"></script>
		<script src="../js/elementui.js"></script>
		<script src="../js/axios.min.js"></script>
		<script src="../js/mycommon.js"></script>


	</head>
	<body>
		<div id="app">
			<form class="login-form">
				<h1 class="login-title">登录</h1>
				<div class="input-box">
					<i class='bx bxs-user'></i>
					<input type="text" v-model="formData.sysusername" placeholder="请输入账号">
				</div>
				<div class="input-box">
					<i class='bx bxs-lock-alt'></i>
					<input type="password" v-model="formData.sysuserpwd" placeholder="请输入密码">
				</div>

				<div class="remember-forgot-box">
					<label for="remember">
						<input type="checkbox" id="remember">
						记住我
					</label>
					<a href="#">忘记密码？</a>
				</div>

				<button class="login-btn" @click="submitForm" type="button">登录</button>

				<p class="register">
					没有账号？
					<a href="../yjw/zhuce.html">创建一个吧！</a>
				</p>
			</form>
		</div>


		<script>
			var vue = new Vue({
				el: "#app",
				data: {
					formData: {
						sysusername: undefined,
						sysuserpwd: undefined,
					}
				},
				methods: {

					submitForm() {
						/* alert(JSON.stringify(this.formData)); */
						var that = this
						//ajax请求后端接口获取json数据
						axios.post(HTTP + "user/login", this.formData).then(function(res) {
							//alert(JSON.stringify(res.data.message));
							if (res.data.code === 200) {
								//that.$message(JSON.stringify(res.data.message));
								window.localStorage.setItem("jwtToken", res.data.data.jwtToken)
								window.location.href = "main.html";
							} else {

								alert(JSON.stringify(res.data.message));
								//	that.$message(JSON.stringify(res.data.message))
							}
						}).catch(err => {
							console.log(err)
						});
					}
				}
			})
		</script>
	</body>
</html>